<!--海外仓上架任务-->
<template>
  <div class="page-container">
    <page_breadcrumb :getKeyMethod="init_table_model" @change="change_table_model" />
    <ex_super_table_page v-bind="option" ref="SuperTablePage" :cell-class-name="cellClassMethod">
    </ex_super_table_page>
    <!-- <detail_overseas_inbound ref="detail_overseas_inbound" /> -->

  </div>
</template>
<script>
import superTablePageFunction from '@/mixin/super-table-page-function';

// import detail_overseas_inbound from './dialog/detail_overseas_inbound.vue';
import page_table_model_manage from '@/mixin/page_table_model_manage';
import emitOnFunction from '@/mixin/emit-on-function';
let emitKey = 'overseas=>putaway_task'
export default {
  title: "title_standard_putaway_task",
  mixins: [superTablePageFunction, emitOnFunction(emitKey), page_table_model_manage],
  components: {  },

  data() {
    return {


      option: {
        search: {
          model: [
            { label: "label_putaway_code", key: "putawayCode", },
            { label: "label_inbound_code", key: "inboundOrderCode", },
            {
              label: "label_putaway_status", key: "putawayStatus", type: 'select', enum: 'PutawayTaskStatusEnum'
            },
            { label: "label_sku", key: "skuId", type: 'sku_selec_input', fold: true, },
           
            {
              label: "label_create_time", key: 'startCreateDate', fold: true,type: 'date-picker',attrs:{type: 'datetime'},
              render: (h, { data, item }) => {
                const value = data[item.key]
                const limitKey = 'endCreateDate'
                const limitValue = data[limitKey]

                return (<ex_super_input value={value} onInput={e => this.$set(data, item.key, e)} type="date-picker" placeholder="label_start_time"
                  attrs={{ type: 'datetime' }}
                  pickerOptions={{
                    disabledDate: date => { return limitValue ? (limitValue < date.getTime()) : false }
                  }}
                />)
              }

            },
            {
              label: "~", key: 'endCreateDate', fold: true,type: 'date-picker',attrs:{type: 'datetime'},
              render: (h, { data, item }) => {
                const value = data[item.key]
                const limitKey = 'startCreateDate'
                const limitValue = data[limitKey]
                return (<ex_super_input value={value} onInput={e => this.$set(data, item.key, e)} type="date-picker" placeholder="label_end_time"
                  attrs={{ type: 'datetime','default-time': '23:59:59' }}
                  pickerOptions={{
                    disabledDate: date => { return limitValue ? (limitValue > date.getTime()) : false }
                  }}
                />)
              }
            },
            {
              label: "label_tms_complete_date", key: 'startFinishDate', fold: true,type: 'date-picker',attrs:{type: 'datetime'},
              render: (h, { data, item }) => {
                const value = data[item.key]
                const limitKey = 'endFinishDate'
                const limitValue = data[limitKey]

                return (<ex_super_input value={value} onInput={e => this.$set(data, item.key, e)} type="date-picker" placeholder="label_start_time"
                  attrs={{ type: 'datetime' }}
                  pickerOptions={{
                    disabledDate: date => { return limitValue ? (limitValue < date.getTime()) : false }
                  }}
                />)
              }

            },
            {
              label: "~", key: 'endFinishDate', fold: true,type: 'date-picker',attrs:{type: 'datetime'},
              render: (h, { data, item }) => {
                const value = data[item.key]
                const limitKey = 'startFinishDate'
                const limitValue = data[limitKey]
                return (<ex_super_input value={value} onInput={e => this.$set(data, item.key, e)} type="date-picker" placeholder="label_end_time"
                  attrs={{ type: 'datetime','default-time': '23:59:59' }}
                  pickerOptions={{
                    disabledDate: date => { return limitValue ? (limitValue > date.getTime()) : false }
                  }}
                />)
              }
            },
          ],

        },
        actionExtra: [
  
          // { label: 'label_print_inbound_code', attrs: { type: "primary" }, click: this.$noFunction },
          // { label: 'label_packing_box_inventory', click: this.$noFunction },
          // { label: 'label_export', attrs: { type: "danger" }, click: this.$noFunction },
        ],
        table: {
          url: "/wms-api/inbound/WmsInboundOverseasPutawayRpc/selectPage.json",
          model: this.init_table_model(),
        }
      },
   
    };
  },

  methods: {
    option_table_model() {
      return [
        { type: 'selection', clickToggle: true, },
        {
          type: 'expandDesc', 'width': 100,
          expandDesc: {
            class: "desc_flex_row",
            column: 4, border: true, direction: 'vertical', labelClassName: 'flex_cell', contentClassName: 'flex_cell',
            model: [],
          },
        },
        { key: 'code', label: 'label_putaway_code', 'min-width': 120, 'show-overflow-tooltip': true, },
        { key: 'inboundOrderCode', label: 'label_inbound_code', 'min-width': 120, 'show-overflow-tooltip': true, },
        {
          key: 'customerName', label: 'label_customer_info', 'min-width': 120, 'show-overflow-tooltip': true,
          formatter: (r, c, v) => this.$formatNameCode(v, r.customerCode)
        },

        { key: 'receivingBoxQty', label: 'label_receiving_box_number', 'width': 100, },
        { key: 'receivingSkuQty', label: 'label_receiving_number', 'width': 100, },
        { key: 'putawayBoxQty', label: 'label_putaway_box_number', 'width': 100, },
        { key: 'putawaySkuQty', label: 'label_putaway_number', 'width': 100, },
        { key: 'putawayStatus', label: 'label_putaway_status', 'width': 120, 'show-overflow-tooltip': true, attrs: { formatter: (r, c, v, i) => this.$enumShow(v, "PutawayTaskStatusEnum") } },


        { key: 'putawayTime', label: 'label_putaway_time', 'width': 130, formatter: (r, c, v, i) => this.$dateFormat(v), },

        {
          key: 'putawayUserName', label: 'label_putaway_user', 'min-width': 120, 'show-overflow-tooltip': true,
          formatter: (r, c, v) => this.$formatNameCode(v, r.putawayUserCode)
        },
        {
          type: 'operate', width: 160, fixed: 'right', operate: [
            {
              type: 'more',
              items: [
                { label: 'label_view_detail', click: (row) => this.clickDetail(row) },
                { label: 'label_putaway',auth:"/page/wms/overseas/inbound/putaway", click: (row) => this.gotoPutaway(row) },

                // { label: 'label_download_attachment' },
              ]
            }
          ]
        }
      ]
    },
    cellClassMethod({ row, column, rowIndex, columnIndex }) {
      if (column.property == 'putawayStatus') {
        if (['NOT_PUTAWAY',].some(it => it == row.putawayStatus)) {
          return 'color_primary'
        } else if (['START_PUTAWAY',].some(it => it == row.putawayStatus)) {
          return 'color_warning'
        } else if (row.putawayStatus == 'PUTAWAY_COMPLETED') {
          return 'color_success'
        }
      }
      return ""
    },
    gotoPutaway(row) {
      this.$router.push({ name: '/page/wms/overseas/inbound/putaway', params: { 'putawayCode': row.code } })
    },
    clickDetail(row) {
      // let title = `${this.$tt('label_putaway_code')}:${row.code}/${this.$tt('label_inbound_code')}:${row.inboundOrderCode}`
      // this.$refs['detail_overseas_inbound'].show({ params: { id: row.inboundOrderId }, title })
      this.$router.push({ name: '/page/wms/overseas/inbound/inbound_detail', query: { 'id': row.inboundOrderId } })


    },

  }
};

</script>
<style></style>
